<template>
	<view>
		
		<view class="whiteBg mb10" v-for="( item , index) in listSync" :key="index">
			<view class="pd15 ptb10">
				<view class="flex">
					<view class="bold fz16" @tap="toggle(item.companyId)" style="flex-grow: 1;">
						{{item.name}}
						<view class="tagGroup ml5" :class="{'yellowBg' : item.status == 2 , 'redBg' : item.status == 3}">
							<view class="tag">{{item.statusStr}}</view>
						</view>
					</view>
					<view class="w20" style="flex-shrink: 0;" @tap="operateMore(item , index)">
						<view class="iconfont icon-gengduo1 fz20 grey"></view>
					</view>
				</view>
				
				<block v-if="item.opened">
					<view class="fz14 grey pt5">
						<text class="pr5 sIcon-mobile bold  main"></text>
						<text class="black pr5">环保负责人：</text> 
						{{item.contacts}}
						{{item.mobile}}
					</view>
					<view class="fz14 grey pt5">
						<text class="pr5 sIcon-location bold  main"></text> {{item.address}}
					</view>
					<view class="fz14 grey pt5" v-if="role == 4">
						<text class="black pr5">运维公司：</text> {{item.serviers?item.serviers:'无'}}
					</view>
					
					<view class="ptb" v-if="item.stations && item.stations.length > 0">
						<view class="grayBg ">
							<station :role="role" :list="item.stations" @delete="delStation($event,item.companyId)"></station>
						</view>
					</view>
					
				</block>
				
				
			</view>
			
			
		</view>
		
	</view>
</template>

<script>
	export default {
		name: 'company',
		data() {
			return {
				role : -1 ,
				opens : [] ,
				stations : {}
			};
		},
		props: {
			list : {
				default : function(){
					return [];
				}
			}
		},
		
		computed:{
			listSync(){
				return this.list.map(item=>{
					item.opened = this.opens.includes(item.companyId) ;
					item.stations = this.stations[item.companyId] || [] ;
					return item ;
				})
			}
		},
		
		created() {
			this.role = uni.getStorageSync("role");
		},
		
		methods: {
			
			init(){
				this.opens =  []; 
			},
			
			delStation:function(e , id){
				this.stations[id].splice(e.index,1);
			},
			
			toggle(id){
				let index = this.opens.findIndex(item => item === id ) ;
				if (index > -1) {
					this.opens.splice(index,1);
				}else{
					this.opens.push(id);
					this.loadStationByCompanyId(id);
				}
			},
			
			loadStationByCompanyId(id){
				var data = {
					"companyId" : id 
				} ;
				this.kit.get("/api/station/listByCompany",data,res => {
					this.$set(this.stations , id , res.list);
				});
			},
			
			makePhoneCall:function(e){
				uni.makePhoneCall({
					phoneNumber:e
				});
			},
			
			chooseLocation:function(item){
				uni.openLocation({
					latitude:item.latitude,
					longitude:item.longitude,
					name : item.name ,
					address: item.address
				});
			},
			
			onClick:function(e){
				if (this.url) {
					uni.navigateTo({
						url: this.url 
					});
					return ;
				}
				this.$emit("onClick",e);
			},
			
			operateMore:function(item , index){
				let itemList = ["拨打电话"] ;
				if (this.role == 2 ) {
					itemList = ["拨打电话","解除绑定","添加站点"] ;
				}else if (this.role == 1) {
					itemList = ["拨打电话","解除绑定"] ;
				}
				uni.showActionSheet({
					itemList ,
					success: (e) => {
						if (e.tapIndex == 0) {
							this.makePhoneCall(item.mobile);
							return ;
						}
						if (e.tapIndex == 1) {
							this.remove(item,index);
						}
						if(e.tapIndex == 2){
							uni.navigateTo({
								url:`/pages/addStation/addStation0?id=${item.companyId}`,
								fail: (e) => {
									console.log("e: ",e);
								}
							});
							return ;
						}
					}
				})
			},
			
			remove:function(item , index){
				uni.showModal({
					title:'提示',
					content:'即将提交解除绑定申请，申请通过后，将清除与该企业所有站点的运维关系，确认提交解除绑定申请吗？',
					confirmColor:'#3385ff',
					success : (e)=>{
						if (e.confirm) {
							var data = {id: item.companyId} ;
							this.kit.get("/api/servicerCompany/remove",data,res => {
								// this.$emit("remove" , {index});	
								uni.showToast({
									title: '申请已提交',
									icon : 'success'
								});
							});
						}
					}
				});
				
			},
		}
	}
</script>

<style>

</style>
